@import url(./reset.css);

html,
body {
  height: 100%;
}

#app {
  height: 100%;
}

.layout-main {
  height: 100%;
}

.flex {
  display: flex;
}

.flex-column {
  flex-direction: column;
}

.flex1 {
  flex: 1;
}

.flex-v-center {
  align-items: center;
}

.flex-center {
  justify-content: center;
  align-items: center;
}

.flex-end {
  justify-content: flex-end;
}

.arco-menu-item {
  color: #1c1f23 !important;
  font-weight: 600;
}

.arco-form-item-label {
  color: #1c1f23 !important;
  font-weight: 600 !important;
}

.arco-menu-inline-content .arco-menu-item {
  padding-left: 25px !important;
}

.arco-menu-selected {
  background-color: rgb(234, 245, 255) !important;
  color: #165dff !important;
  font-weight: 600 !important;
}

.arco-menu-inline-header {
  color: rgb(28, 31, 25) !important;
  font-weight: 600 !important;
}

.toolbar {
  padding-bottom: 16px;
}

.main-con {
  padding: 16px;
}

.empty-card-wrap .arco-card-body {
  height: 100% !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 16px 20px !important;
  cursor: pointer !important;
}

.custom-transfer .arco-transfer-view {
  width: 320px;
}

.custom-statistic {
  /* height: 95px; */
  border-radius: 4px;
  padding: 16px 12px;
  /* width: 100%; */
  flex: 1;
}

.yellow .custom-statistic {
  background: linear-gradient(180deg, #fefbf2 0%, #fef3e6 100%);
}

.green .custom-statistic {
  background: linear-gradient(180deg, #f5fef2 0%, #e6feee 100%);
}

.blue .custom-statistic {
  background: linear-gradient(180deg, #f6f7ff 0%, #ececff 100%);
}

.red .custom-statistic {
  background: linear-gradient(180deg, #f6f7ff 0%, #ececff 100%);
  color: red !important;
}

.statistic-card {
  background-color: #fff;
  border-radius: 4px;
  padding: 16px;
  margin-top: 20px;
}

.statistic-card .header {
  padding: 16px 0;
  color: #1d2129;
  font-size: 16px;
  font-weight: 600;
}

.statistic-card .card-content {
  padding: 32px 0;
  /* min-height: 200px; */
}

.mt-16 {
  margin-top: 16px;
}

.content-class {
  color: #666;
}

.basechart {
  height: 350px;
}

.arco-layout-sider-children {
  flex: 1;
  display: flex;
  flex-direction: column;
}

.arco-checkbox-icon {
  position: relative;
  box-sizing: border-box;
  width: 14px;
  height: 14px;
  background-color: var(--color-bg-2);
  border: 2px solid var(--color-fill-3);
  border-radius: 3px !important;
  -webkit-user-select: none;
  user-select: none;
}
